<!DOCTYPE html><html><head><title>2018年第二期前三周复习</title><meta charset='utf-8'><link href='https://dn-maxiang.qbox.me/res-min/themes/marxico.css' rel='stylesheet'><style>
.note-content  {font-family: 'Helvetica Neue', Arial, 'Hiragino Sans GB', STHeiti, 'Microsoft YaHei', 'WenQuanYi Micro Hei', SimSun, Song, sans-serif;}

</style></head><body><div id='preview-contents' class='note-content'>
                        
                    



<h3 id="2018年第二期前三周复习">2018年第二期前三周复习</h3>

<p></p>

<ol><li rel="1">写出你所熟知的ES6新语法，说出它们和ES5的区别！</li>
<li rel="2">请说出你对 “重排和重绘读写分离”  的理解！</li>
<li rel="3">写出下面代码运行的结果</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">var</span> str=<span class="hljs-string">'abc123'</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    num=<span class="hljs-built_in">parseFloat</span>(str);
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span><span class="hljs-keyword">if</span>(num===<span class="hljs-literal">NaN</span>){
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    alert(<span class="hljs-literal">NaN</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>}<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(num===<span class="hljs-number">123</span>){
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>    alert(<span class="hljs-number">123</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>}<span class="hljs-keyword">else</span> <span class="hljs-keyword">if</span>(<span class="hljs-keyword">typeof</span> num===<span class="hljs-string">'number'</span>){
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>    alert(<span class="hljs-string">'number'</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>}<span class="hljs-keyword">else</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>    alert(<span class="hljs-string">'str'</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span>}
</div></code></pre>

<ol start="4"><li rel="4">写出代码执行的结果</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">var</span> a=<span class="hljs-string">'abc'</span>+<span class="hljs-number">123</span>+<span class="hljs-number">456</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>alert(a);
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span><wbr>
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span><span class="hljs-keyword">var</span> b=<span class="hljs-string">'456'</span>-<span class="hljs-string">'123'</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>alert(b);
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span><wbr>
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span><span class="hljs-keyword">var</span> c=<span class="hljs-number">1</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>    d=<span class="hljs-string">'1'</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span><span class="hljs-keyword">var</span> f=c&gt;d?(c&lt;d?c:d):(c==d?c:d);
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>alert(f);
</div></code></pre>

<ol start="5"><li rel="5">用户昵称规定只能是“数字、大小写字母”组成，而且不能少于2位，也不能超过20位，写个正则匹配这个需求</li>
<li rel="6">谈谈你对面向对象的理解！</li>
<li rel="7">写出代码运行结果</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">var</span> point={
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    <span class="hljs-attr">x</span>:<span class="hljs-number">10</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>    <span class="hljs-attr">y</span>:<span class="hljs-number">20</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    <span class="hljs-attr">moveTo</span>:<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">x,y</span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>        <span class="hljs-keyword">var</span> moveX=<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">x</span>)</span>{ <span class="hljs-keyword">this</span>.x=x; }
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>        <span class="hljs-keyword">var</span> moveY=<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">y</span>)</span>{ <span class="hljs-keyword">this</span>.y=y; }
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>        moveX(x);
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>        moveY(y);
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>    }
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span>point.moveTo(<span class="hljs-number">100</span>,<span class="hljs-number">200</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">12.</span><span class="hljs-built_in">console</span>.log(point.x,point.y);
</div></code></pre>

<ol start="8"><li rel="8">分析代码写结果</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">fun</span>(<span class="hljs-params"></span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    <span class="hljs-keyword">this</span>.a=<span class="hljs-number">10</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>    <span class="hljs-keyword">this</span>.b=<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>        alert(<span class="hljs-keyword">this</span>.a);
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>    }
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>}
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>fun.prototype={
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>    <span class="hljs-attr">b</span>:<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>        <span class="hljs-keyword">this</span>.a=<span class="hljs-number">20</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>        alert(<span class="hljs-keyword">this</span>.a);
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span>    },
</div><div class="hljs-line"><span class="hljs-comment line-number">12.</span>    <span class="hljs-attr">c</span>:<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">13.</span>        <span class="hljs-keyword">this</span>.a=<span class="hljs-number">30</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">14.</span>        alert(<span class="hljs-keyword">this</span>.a)
</div><div class="hljs-line"><span class="hljs-comment line-number">15.</span>    }
</div><div class="hljs-line"><span class="hljs-comment line-number">16.</span>}
</div><div class="hljs-line"><span class="hljs-comment line-number">17.</span><span class="hljs-keyword">var</span> my_fun=<span class="hljs-keyword">new</span> fun();
</div><div class="hljs-line"><span class="hljs-comment line-number">18.</span>my_fun.b();
</div><div class="hljs-line"><span class="hljs-comment line-number">19.</span>my_fun.c();
</div></code></pre>

<ol start="9"><li rel="9">分析代码写结果</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">var</span> n=<span class="hljs-number">2</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">a</span>(<span class="hljs-params"></span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>    <span class="hljs-keyword">var</span> n=<span class="hljs-number">3</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    <span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">b</span>(<span class="hljs-params">m</span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>        alert(++n+m);
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>    }
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>    b(<span class="hljs-number">4</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>    <span class="hljs-keyword">return</span> b;
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>}
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span><span class="hljs-keyword">var</span> c=a(<span class="hljs-number">5</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span>c(<span class="hljs-number">6</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">12.</span>alert(n);
</div></code></pre>

<ol start="10"><li rel="10">谈一下你对作用域链和原型链的理解</li>
<li rel="11">实现 一个$attr(domId,name,value)遍历id是domId的，内部属性为name且值为value的元素？ </li>
<li rel="12">实现数组去重你都有哪些办法?</li>
<li rel="13">说出你所掌握的算法</li>
<li rel="14">写出你掌握的JS继承方式，项目中什么时候你用到了继承？</li>
<li rel="15">JS中有一个insertBefore方法，目的是实现把新元素插入到指定元素之前，现在你实现一个 InsertAfter 方法，把新元素插入到指定元素之后！</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">insertAfter</span>(<span class="hljs-params">newEle,originEle</span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    <span class="hljs-comment">//=&gt;newEle:新插入的元素</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>    <span class="hljs-comment">//=&gt;originEle:指定的老元素</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>}
</div></code></pre>

<ol start="16"><li rel="16">英文字母汉字组成的字符串，用正则给英文单词前后加空格 </li>
<li rel="17">jQuery的原理，怎么扩展插件</li>
<li rel="18">看代码，回答问题</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">for</span>(<span class="hljs-keyword">var</span> i = <span class="hljs-number">0</span>;i&lt;<span class="hljs-number">5</span>;i++){ 
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    setTimeout(<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>)</span>{ 
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>        <span class="hljs-built_in">console</span>.log(i) 
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    },<span class="hljs-number">1000</span>); 
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>} 
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>这段代码输出什么？怎么才能输出<span class="hljs-number">01234</span>？
</div></code></pre>

<ol start="19"><li rel="19">分析代码写结果</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">var</span> a = {<span class="hljs-attr">n</span>:<span class="hljs-number">4</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span><span class="hljs-keyword">var</span> b = a;
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>b.x = a = {<span class="hljs-attr">n</span>: <span class="hljs-number">10</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span><span class="hljs-built_in">console</span>.log(a.x);
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span><span class="hljs-built_in">console</span>.log(b.x);
</div></code></pre>

<ol start="20"><li rel="20">你了解过闭包吗？</li>
<li rel="21"></li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">var</span> fullName=<span class="hljs-string">'language'</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span><span class="hljs-keyword">var</span> obj={
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>   <span class="hljs-attr">fullName</span>:<span class="hljs-string">'javascript'</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>   <span class="hljs-attr">prop</span>:{
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>      <span class="hljs-attr">getFullName</span>:<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>)</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>         <span class="hljs-keyword">return</span> <span class="hljs-keyword">this</span>.fullName;
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>      }
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>   }
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span><span class="hljs-built_in">console</span>.log(obj.prop.getFullName());
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span><span class="hljs-keyword">var</span> test=obj.prop.getFullName;
</div><div class="hljs-line"><span class="hljs-comment line-number">12.</span><span class="hljs-built_in">console</span>.log(test());
</div></code></pre>

<ol start="22"><li rel="22"></li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">let</span> a = <span class="hljs-number">3</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    b = <span class="hljs-number">4</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">A</span>(<span class="hljs-params">a</span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    A = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">b</span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>        alert(a + (--b));
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>    };
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>    alert(++a);
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>}
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>A(<span class="hljs-number">5</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>A(<span class="hljs-number">6</span>);
</div></code></pre>

<p>23.</p>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-built_in">window</span>.val = <span class="hljs-number">1</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span><span class="hljs-keyword">let</span> json = { 
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>    <span class="hljs-attr">val</span>: <span class="hljs-number">10</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    <span class="hljs-attr">dbl</span>: <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>        <span class="hljs-keyword">this</span>.val *= <span class="hljs-number">2</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>    }
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>json.dbl();
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span><span class="hljs-keyword">let</span> dbl = json.dbl;
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>dbl();
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span>json.dbl.call(<span class="hljs-built_in">window</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">12.</span>alert(<span class="hljs-built_in">window</span>.val + json.val);
</div></code></pre>

<p>24.</p>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span>(<span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    <span class="hljs-keyword">let</span> val = <span class="hljs-number">1</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>    <span class="hljs-keyword">let</span> json = {
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>        <span class="hljs-attr">val</span>: <span class="hljs-number">10</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>        <span class="hljs-attr">dbl</span>: <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>            val *= <span class="hljs-number">2</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>        }
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>    };
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>    json.dbl();
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>    alert(json.val + val);
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span>})();
</div></code></pre>

<p>25.</p>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">let</span> test = (<span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">i</span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    <span class="hljs-keyword">return</span> <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>        alert(i *= <span class="hljs-number">2</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    }
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>})(<span class="hljs-number">2</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>test(<span class="hljs-number">5</span>); 
</div></code></pre>

<p>26.</p>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">let</span> n = <span class="hljs-number">2</span>,
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    fn = <span class="hljs-function"><span class="hljs-params">()</span> =&gt;</span> {
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>        <span class="hljs-keyword">this</span>.n *= <span class="hljs-number">3</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>        n++;
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>        <span class="hljs-keyword">return</span> <span class="hljs-function"><span class="hljs-params">m</span>=&gt;</span><span class="hljs-built_in">console</span>.log((++n)+m);
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>    };
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span><span class="hljs-keyword">var</span> f = fn(<span class="hljs-number">4</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>f(<span class="hljs-number">5</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>fn(<span class="hljs-number">4</span>)(<span class="hljs-number">5</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>f(<span class="hljs-number">6</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span><span class="hljs-built_in">console</span>.log(n);
</div></code></pre>

<ol start="27"><li rel="27">忽略报错阻碍代码的执行</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">let</span> Fn = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">x = <span class="hljs-number">0</span>, y = <span class="hljs-number">0</span></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    <span class="hljs-keyword">this</span>.x = x;
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>    <span class="hljs-keyword">this</span>.y = y;
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    <span class="hljs-keyword">this</span>.getX = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>        <span class="hljs-built_in">console</span>.log(<span class="hljs-keyword">this</span>.x);
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>    }
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>Fn.prototype.getX = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>    <span class="hljs-built_in">console</span>.log(<span class="hljs-keyword">this</span>.x);
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span><span class="hljs-keyword">let</span> f1 = <span class="hljs-keyword">new</span> Fn;
</div><div class="hljs-line"><span class="hljs-comment line-number">12.</span>Fn.prototype = {
</div><div class="hljs-line"><span class="hljs-comment line-number">13.</span>    <span class="hljs-attr">getY</span>: <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">14.</span>        <span class="hljs-built_in">console</span>.log(<span class="hljs-keyword">this</span>.y);
</div><div class="hljs-line"><span class="hljs-comment line-number">15.</span>    }
</div><div class="hljs-line"><span class="hljs-comment line-number">16.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">17.</span><span class="hljs-keyword">let</span> f2 = <span class="hljs-keyword">new</span> Fn(<span class="hljs-number">1</span>, <span class="hljs-number">2</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">18.</span><span class="hljs-built_in">console</span>.log(f1.constructor===f2.constructor);
</div><div class="hljs-line"><span class="hljs-comment line-number">19.</span>f1.getX();
</div><div class="hljs-line"><span class="hljs-comment line-number">20.</span>f1.getY();
</div><div class="hljs-line"><span class="hljs-comment line-number">21.</span>f1.__proto__.getX();
</div><div class="hljs-line"><span class="hljs-comment line-number">22.</span>f1.__proto__.getY();
</div><div class="hljs-line"><span class="hljs-comment line-number">23.</span>f2.getX();
</div><div class="hljs-line"><span class="hljs-comment line-number">24.</span>f2.getY();
</div><div class="hljs-line"><span class="hljs-comment line-number">25.</span>f2.__proto__.getX();
</div><div class="hljs-line"><span class="hljs-comment line-number">26.</span>f2.__proto__.getY();
</div></code></pre>

<ol start="28"><li rel="28">写出输出结果，说出原因</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">let</span> fn1=<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>)</span>{alert(<span class="hljs-number">1</span>)},
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    fn2=<span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>)</span>{alert(<span class="hljs-number">2</span>)};
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>fn1.call(fn2);
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>fn1.call.call(fn2);
</div></code></pre>

<ol start="29"><li rel="29">如下一个字符串 “54389”，要求将字符串中的阿拉伯数字替换成我们的中文大写数字”伍肆叁捌玖”，请使用正则的方式进行处理</li>
<li rel="30">在javascript对象上定义一个repeatify函数,这个函数接受一个整数参数,来明确子字符串需要重复几次,这个函数要求字符串重复指定的次数,比如:’abc’.repeatify(3);//”abcabcabc”</li>
<li rel="31"><code>var str='hello&lt;img src="haha.png" alt="哈哈"/&gt;world';</code>正确匹配输出’hello[哈哈]world’ </li>
<li rel="32">一个url 后面好多key-value 如localhost?key=val&amp;key2=val2&amp;key3=val3 封装一个函数 getParam(‘key’) 通过key获得相应等号后面的值.</li>
<li rel="33">call、apply、bind的区别 </li>
<li rel="34">有两个升序数组，然后将他们合为 一个数组并进行升序排序？</li>
<li rel="35">瀑布流的实现原理 </li>
<li rel="36">图片延迟加载怎么实现 </li>
<li rel="37">写出完整的验证函数 </li>
</ol>

<blockquote>
  <p>1)长度不能小于6位  <br>
  2)首字母必须是字母  <br>
  3)合法字符只能是数字、字母、下划线 </p>
</blockquote>

<ol start="38"><li rel="38">使用jquery实现点击按钮弹出一个对话框（对话框在整个页面正中间，并且最初页面中没有任何的HTML标签）？</li>
<li rel="39">怎么避免全局变量的污染？</li>
<li rel="40"></li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">Foo</span>(<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    getName = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>        <span class="hljs-built_in">console</span>.log(<span class="hljs-number">1</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    };
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>    <span class="hljs-keyword">return</span> <span class="hljs-keyword">this</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>}
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>Foo.getName = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>    <span class="hljs-built_in">console</span>.log(<span class="hljs-number">2</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>Foo.prototype.getName = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span>    <span class="hljs-built_in">console</span>.log(<span class="hljs-number">3</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">12.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">13.</span><span class="hljs-keyword">var</span> getName = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">14.</span>    <span class="hljs-built_in">console</span>.log(<span class="hljs-number">4</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">15.</span>};
</div><div class="hljs-line"><span class="hljs-comment line-number">16.</span><span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">getName</span>(<span class="hljs-params"></span>) </span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">17.</span>    <span class="hljs-built_in">console</span>.log(<span class="hljs-number">5</span>);
</div><div class="hljs-line"><span class="hljs-comment line-number">18.</span>}
</div><div class="hljs-line"><span class="hljs-comment line-number">19.</span>Foo.getName();
</div><div class="hljs-line"><span class="hljs-comment line-number">20.</span>getName();
</div><div class="hljs-line"><span class="hljs-comment line-number">21.</span>Foo().getName();
</div><div class="hljs-line"><span class="hljs-comment line-number">22.</span>getName();
</div><div class="hljs-line"><span class="hljs-comment line-number">23.</span><span class="hljs-keyword">new</span> Foo.getName();
</div><div class="hljs-line"><span class="hljs-comment line-number">24.</span><span class="hljs-keyword">new</span> Foo().getName();
</div><div class="hljs-line"><span class="hljs-comment line-number">25.</span><span class="hljs-keyword">new</span> <span class="hljs-keyword">new</span> Foo().getName();
</div></code></pre>

<p>41.</p>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span>在函数式编程当中有一个很重要的概念就是函数组合，实际上就是把处理数据的函数像管道一样连接起来，然后让数据穿过管道得到最终的结果。例如：
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span><span class="hljs-keyword">const</span> add1 = <span class="hljs-function">(<span class="hljs-params">x</span>) =&gt;</span> x + <span class="hljs-number">1</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span><span class="hljs-keyword">const</span> mul3 = <span class="hljs-function">(<span class="hljs-params">x</span>) =&gt;</span> x * <span class="hljs-number">3</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span><span class="hljs-keyword">const</span> div2 = <span class="hljs-function">(<span class="hljs-params">x</span>) =&gt;</span> x / <span class="hljs-number">2</span>;
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>div2(mul3(add1(add1(<span class="hljs-number">0</span>)))) <span class="hljs-comment">//=&gt;3</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span><wbr>
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>而这样的写法可读性明显太差了。我们可以构建一个 compose 函数，它接受任意多个函数作为参数（这些函数都只接受一个参数），然后 compose 返回的也是一个函数，达到以下的效果：
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span><span class="hljs-keyword">const</span> operate = compose(div2, mul3, add1, add1)
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>operate(<span class="hljs-number">0</span>) <span class="hljs-comment">//=&gt;相当于div2(mul3(add1(add1(0)))) </span>
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>operate(<span class="hljs-number">2</span>) <span class="hljs-comment">//=&gt;相当于div2(mul3(add1(add1(2))))</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span><wbr>
</div><div class="hljs-line"><span class="hljs-comment line-number">12.</span>简而言之：compose 可以把类似于 f(g(h(x))) 这种写法简化成 compose(f, g, h)(x)。请你完成 compose 函数的编写。
</div><div class="hljs-line"><span class="hljs-comment line-number">13.</span>额外挑战：你能通过 <span class="hljs-number">1</span>~<span class="hljs-number">2</span> 行代码实现 compose 吗。
</div></code></pre>

<ol start="42"><li rel="42">点击每一个li可以创建出对应的对象（可以不兼容低版本浏览器）</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span>[结构]
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>&lt;ul&gt;
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>  <span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span><span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">'http://xxx'</span>&gt;</span>xxx<span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span></span>
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>  &lt;li&gt;<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">'http://sss'</span>&gt;</span>sss<span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span></span><span class="xml"><span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span></span>
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>&lt;<span class="hljs-regexp">/ul&gt;
</span></div><div class="hljs-line"><span class="hljs-comment line-number">6.</span><wbr>
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span>点击第一个LI创建对象：
</div><div class="hljs-line"><span class="hljs-comment line-number">8.</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">9.</span>   index:1,
</div><div class="hljs-line"><span class="hljs-comment line-number">10.</span>   name:'xxx',
</div><div class="hljs-line"><span class="hljs-comment line-number">11.</span>   link:'http:/<span class="hljs-regexp">/xxx'
</span></div><div class="hljs-line"><span class="hljs-comment line-number">12.</span>}
</div><div class="hljs-line"><span class="hljs-comment line-number">13.</span>同样点击第二个LI创建对象
</div><div class="hljs-line"><span class="hljs-comment line-number">14.</span>{
</div><div class="hljs-line"><span class="hljs-comment line-number">15.</span>   index:2,
</div><div class="hljs-line"><span class="hljs-comment line-number">16.</span>   name:'sss,
</div><div class="hljs-line"><span class="hljs-comment line-number">17.</span>   link:'http:/<span class="hljs-regexp">/sss'
</span></div><div class="hljs-line"><span class="hljs-comment line-number">18.</span>}
</div><div class="hljs-line"><span class="hljs-comment line-number">19.</span>...
</div></code></pre>

<ol start="43"><li rel="43">分析此函数的作用，补全1/2处的代码</li>
</ol>



<p><img longdesc="./1525193206478.png" alt="Alt text" title="" type="image/png" src="" class=""></p>

<ol start="44"><li rel="44">获取数据中的最大值</li>
<li rel="45">编写一个函数，把一个列表中的每一项反序</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="hljs xml"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-tag">&lt;<span class="hljs-name">ul</span> <span class="hljs-attr">id</span>=<span class="hljs-string">'target'</span>&gt;</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">2.</span>    <span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span>1<span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">3.</span>    <span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span>2<span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">4.</span>    <span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span>3<span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">5.</span>    <span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span>4<span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">6.</span>    <span class="hljs-tag">&lt;<span class="hljs-name">li</span>&gt;</span>5<span class="hljs-tag">&lt;/<span class="hljs-name">li</span>&gt;</span>
</div><div class="hljs-line"><span class="hljs-comment line-number">7.</span><span class="hljs-tag">&lt;/<span class="hljs-name">ul</span>&gt;</span>
</div></code></pre>

<ol start="46"><li rel="46">编写一个函数实现数组扁平化</li>
</ol>



<pre class="prettyprint with-line-number hljs-dark"><code class="language-javascript hljs"><div class="hljs-line"><span class="hljs-comment line-number">1.</span><span class="hljs-keyword">let</span> ary = [<span class="hljs-number">1</span>,[<span class="hljs-number">2</span>,[<span class="hljs-number">3</span>,[<span class="hljs-number">4</span>,<span class="hljs-number">5</span>]]],<span class="hljs-number">6</span>];  <span class="hljs-comment">//=&gt;[1,2,3,4,5,6]</span>
</div></code></pre>

<ol start="47"><li rel="47">网页中实现一个计算，计算当年还剩多少时间的倒数计时程序，要求网页上显示 “xxxx年还剩xx天xx时xx分xx秒”；（获取当前时间采用new Data()即可）</li>
<li rel="48">offsetHeight/clientHeight/scrollHeight的区别 </li>
<li rel="49">获取字符串中出现次数最多的字符及出现的次数</li>
<li rel="50">完成如图所示的文字横向无缝衔接滚动的“跑马灯”效果</li>
</ol>



<p><img longdesc="./1525194300369.png" alt="Alt text" title="" type="image/png" src="" class=""></p></div></body></html>